import * as tools from './tools.js';
import '../sass/common.scss';
import {initHeaderFooter} from './gopLib/initHeaderFooter';
jQuery.support.cors = true;
let timer = '';
$(function () {
  initHeaderFooter('index');

  $('.op-box').click(function () {
    return
    let $trg = $('.pro_item.active');
    let $trg_title = $('.des.active');
    let $group = $('.pro_item');
    let $trg_tRoupo = $('.des');
    $trg.removeClass('active');
    $trg_title.removeClass('active');

    let index = $group.index($trg);
    if ($trg.next().length <= 0) {
      $trg_tRoupo.eq(0).addClass('active');
      $group.eq(0).addClass('active');
    } else {
      $trg_tRoupo.eq(index + 1).addClass('active');
      $trg.next().addClass('active');
    }
  });

  $('.op-box').hover(function(){
    clearInterval(timer);
  }, function(){
    loop_guid();
  });

  $('.op-box .pro_item').hover(function() {
    if($(this).hasClass('active')) return
    let $trg = $('.pro_item.active');
    let $trg_title = $('.des.active');
    let $group = $('.pro_item');

    $trg.removeClass('active');
    $trg_title.removeClass('active');
    let index = $group.index($(this));

    let $trg_tRoupo = $('.des').eq(index);
    $(this).addClass('active');
    $trg_tRoupo.addClass('active');
  }, function() {

  });

  $(document).on('click', '.b1s_btn', function() {
    let num = $('#orderN').val();
    location.href = './orderSearch.html?order=' + num;
  })

  initBanner();
  initCoop();
  initPlatInfo();
  loop_guid();
});

function add_c() {

}

function loop_guid() {
  timer = setInterval(do_change, 3000)
}

function do_change() {
  let $trg = $('.pro_item.active');
  let $trg_title = $('.des.active');
  let $group = $('.pro_item');
  let $trg_tRoupo = $('.des');
  $trg.removeClass('active');
  $trg_title.removeClass('active');

  let index = $group.index($trg);
  if ($trg.next().length <= 0) {
    $trg_tRoupo.eq(0).addClass('active');
    $group.eq(0).addClass('active');
  } else {
    $trg_tRoupo.eq(index + 1).addClass('active');
    $trg.next().addClass('active');
  }
}

//请求banner 数据
function initBanner() {
  $.ajax({
    url : tools.apiUrl + 'rolledImage/imgList',
    type : 'post',
    contentType:'text/xml',
    data : 'ROLLED',
    success : function(res) {
      let data = res.data;
      if (res.code == '200') {
        initSwiper(data);
        initBannerText();
      }
    }
  });
  return

 
}
//初始化滚动
function initSwiper(data) {
  let $trg = $('.swiper-wrapper');
  data.map((val, index) => {
    // style="background:url('${val.url}');background-size:cover">

    let html = `
    <div class="swiper-slide need_text" data="need_text" style="position:relative;background:black">
      <img width="100%" src="${val.url}" />
    </div>
    `;
    $trg.append(html);
  });

  $trg.find('.need_text').each(function(index){
    let html = '';
    if(index == 0) {
      html = `<div class="banner-text-wrap banner-1">
                <div class="banner-text-item">
                  <div class="b1_line"></div>
                  <img class="b1_text" src="../src/images/gop_1.1/banner_1_text.png">
                </div>
              </div>`
    }

    if(index == 1) {
      html = `<div class="banner-text-wrap banner-2">
                <div class="banner-text-item">
                    <div class="b1_line"></div>
                    <img class="b1_text" src="../src/images/gop_1.1/banner_2_text.png">
                </div>
              </div>`;
    }

    $(this).append(html);
  })

  var mySwiper = $('.swiper-container').swiper({
    loop: true,
    autoplay: 5000,
    pagination: '.pagination',
    paginationClickable: true,
    //其他设置
  });
}

//初始化banner 广告文字
function initBannerText() {

}

//请求合作伙伴数据
function initCoop() {
  $.ajax({
    url : tools.apiUrl + 'rolledImage/imgList',
    type : 'post',
    contentType:'text/xml',
    data : 'PARTNER',
    success : function(res) {
      let data = res.data;
      if (res.code == '200') {
        renderCoop(data);
      }
    }
  });
  return

}

//渲染合作伙伴数据
function renderCoop(data) {
  let $trg = $('.cops_list');
  data.map(val => {
    $trg.append(`
      <div class="cops_item">
          <div class="cops_img">
              <img src="${val.url}" alt="${val.name}" />
          </div>
      </div>
      `)
  })
};

//请求平台消息
function initPlatInfo() {
  $.ajax({
    url : tools.apiUrl + 'rolledImage/imgList',
    type : 'post',
    contentType:'text/xml',
    data : 'PLATFORM',
    success : function(res) {
      let data = res.data;
      if (res.code == '200') {
        renderPlatInfo(data);
      }
    }
  });
}

//渲染平台消息
function renderPlatInfo(data) {
  if(data.length <= 0) return 
  let $trg = $('.info_wrap_box');
  for (let i = 0; i < data.length; i++) {
    if(i == 4) break;
    let val = data[i];
    $trg.append(
      `    
        <div class="info_item" data-id="${val.id}">
          <div class="info_content">
              <div class="animate-wrap">
                  <div class="info_head">
                    <span>0${i+1}</span>
                  </div>
                  <div class="info_body">
                      <p class="info_time">${ tools.timeModify((new Date(val.createTime)).format('yyyy-MM-dd'))}</p>
                      <p class="info_title">${val.name}</p>
                      <p class="info_des">${val.content}</p>
                      <div class="info_img_box" style="background:url('${val.url}') no-repeat;background-size:cover">
                      </div>
                  </div>
              </div>
            </div>
          </div>
          `
    )

  }
}


$('.info_').on('click', '.info_item', function() {
  window.location.href = './platInfoDetail.html?id=' + $(this).attr('data-id');
})